<template>
	<header-footer :commonData="{$parent:$parent}">
		<div class="confirmOrder">
			<div class="task_crumb index_width">
				<ul>
					<li class="f_left">当前位置：</li>
					<li class="f_left">
						<router-link to="/home">首页></router-link>
					</li>
					<li class="f_left">
						<router-link to="javascript:void(0)">订单确认</router-link>
					</li>
					</li>
				</ul>
			</div>
			<div class="task_list mainToBottom index_width text_center">
				<img src="/static/img/title2.png">
				<div class="company_order_sure">
					<h3 class="text_center">{{cName}}</h3>
					<ul class="company_order_sure_ul">
						<li class="f_left" style="margin-right: 100px;margin-left: 30px">总报名人数：<span class="company_zong_num">{{result.applySum}}人</span></li>
						<li class="f_left" style="margin-right: 80px;">报名失败人数：<span>{{result.loseApply.length}}人</span></li>
						<li class="f_left">总费用：<span class="company_zong_fei">{{result.priceSum}}元</span></li>
					</ul>
					<div class="company_table_success">
						<table width="100%">
							<thead>
								<tr>
									<td>专业</td>
									<td>报名总人数</td>
									<td>费用总计</td>
								</tr>
							</thead>
							<tbody>
								<tr v-for="(item,index) in result.succeeApply" :key="index">
									<td>{{item.typeName}}</td>
									<td>{{item.applyPeopleSum}}</td>
									<td>{{item.applyPriceSum}}</td>
								</tr>
							</tbody>
						</table>
					</div>
					<p style="margin: 50px 0 30px 30px;font-weight: bolder;font-size: 20px;">报名失败统计</p>
					<div class="company_table_success table_error">
						<table width="100%">
							<thead>
								<tr>
									<td>姓名</td>
									<td>手机号</td>
									<td>失败专业</td>
									<td>失败原因</td>
								</tr>
							</thead>
							<tbody>
								<tr v-for="(item,index) in result.loseApply" :key="index">
									<td>{{item.realName}}</td>
									<td>{{item.telephone}}</td>
									<td>{{item.typeName}}</td>
									<td>{{item.errMsg}}</td>
								</tr>
							</tbody>
						</table>
					</div>
				</div>
			</div>
			<div class="company_order_btns text_center">
				<a v-if="showNextBtn" class="company_order_next_btn" @click="merchantApplyToSubmit">下一步</a>
			</div>
		</div>
	</header-footer>
</template>

<script>
	import headerFooter from '../../../components/cont_education/header_and_footer.vue'
	export default {
		name: "company_order_confirm",
		data: function() {
			return {
				uuid: this.$route.params.uuid,
				showNextBtn: false,
				fileListUpload: [],
				cName: {},
				result: {
					succeeApply: [],
					loseApply: [],
					succeeApplyCount: 0,
					applySum: 0,
					priceSum: 0,
				}
			}
		},
		mounted: function() {
			var that = this;
			this.common.post(this.api.getMerchantApplyResult, {}, function(res) {
				that.result = res.resultMap;
				that.cName = res.resultMap.mName;
				that.result.succeeApply = res.resultMap.map.succeeApply;
				that.result.loseApply = res.resultMap.map.loseApply;
				that.result.applySum = res.resultMap.map.applySum;
				that.result.succeeApplyCount = res.resultMap.map.succeeApplyCount;
				that.result.priceSum = res.resultMap.map.priceSum;
				if (that.result.priceSum == 0) {
					that.showNextBtn = false;
				} else {
					that.showNextBtn = true;
				}
			});
		},
		methods: {
			merchantApplyToSubmit: function() {
				var that = this;
				this.common.post(this.api.merchantApplyToSubmit, {
					uuid: this.uuid
				}, function(data) {
					if (!String.isEmptyOrNUll(data.resultMap)) {
						that.common.toPage("/cont_education/apply/zhifubao/" + data.resultMap);
					}
				});
			}
		},
		components: {
			headerFooter
		}
	}
</script>

<style>
</style>
